<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title>Caviar.Demo.Wasm</title>
    <base href="/" />
    <link href="css/app.css" rel="stylesheet" />

</head>

<body>
    <div id="app">
        <style>
            @keyframes slide {
                0% {
                    transform: translateX(-25%);
                }

                100% {
                    transform: translateX(25%);
                }
            }

            .mud-wasm {
                animation: slide 3s ease-in-out infinite alternate;
                background-image: linear-gradient(-60deg,#1E88E5 50%,#0069c0 50%);
                bottom: 0;
                left: -50%;
                opacity: .5;
                position: fixed;
                right: -50%;
                top: 0;
                z-index: -1
            }

            .mud-wasm-cont {
                left: 50%;
                padding: 10vmin;
                position: fixed;
                text-align: center;
                top: 50%;
                transform: translate(-50%,-50%)
            }
        </style>

        <div style="height:100%;width:100%;margin:0;position:fixed;">
            <div class="mud-wasm"></div>
            <div class="mud-wasm" style="animation-direction:alternate-reverse;animation-duration:4s;"></div>
            <div class="mud-wasm" style="animation-duration:5s;"></div>
            <div class="mud-wasm-cont ">
                <svg width="1055" height="539" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
                    <!-- Created with Method Draw - http://github.com/duopixel/Method-Draw/ -->
                    <g>
                        <title>background</title>
                        <rect fill="none" id="canvas_background" height="541" width="1057" y="-1" x="-1" />
                        <g display="none" overflow="visible" y="0" x="0" height="100%" width="100%" id="canvasGrid">
                            <rect fill="url(#gridpattern)" stroke-width="0" y="0" x="0" height="100%" width="100%" />
                        </g>
                    </g>
                    <g>
                        <image xlink:href="" id="svg_1" height="150" width="152" y="93.5" x="442.5" />
                        <image xlink:href="" id="svg_2" height="180" width="293" y="189.5" x="371" />
                    </g>
                </svg>
            </div>
        </div>
    </div>

    <div id="blazor-error-ui">
        An unhandled error has occurred.
        <a href="" class="reload">Reload</a>
        <a class="dismiss">🗙</a>
    </div>
    <script src="_framework/blazor.webassembly.js" autostart="false"></script>
    <script src="_content/Caviar.AntDesignUI/js/decode.min.js"></script>
    <script type="module">
        Blazor.start({
            loadBootResource: function (type, name, defaultUri, integrity) {
                if (type !== 'dotnetjs' && location.hostname !== 'localhost') {
                    return (async function () {
                        const response = await fetch(defaultUri + '.br', { cache: 'no-cache' });
                        if (!response.ok) {
                            throw new Error(response.statusText);
                        }
                        const originalResponseBuffer = await response.arrayBuffer();
                        const originalResponseArray = new Int8Array(originalResponseBuffer);
                        const decompressedResponseArray = BrotliDecode(originalResponseArray);
                        const contentType = type ===
                            'dotnetwasm' ? 'application/wasm' : 'application/octet-stream';
                        return new Response(decompressedResponseArray,
                            { headers: { 'content-type': contentType } });
                    })();
                }
            }
        });
    </script>
    <link href="_content/AntDesign/css/ant-design-blazor.css" rel="stylesheet" id="uiCss" media="screen">
    <script src="_content/AntDesign/js/ant-design-blazor.js"></script>
    <script src="_content/Caviar.AntDesignUI/js/caviar.js"></script>
    <script src="_content/Caviar.AntDesignUI/js/prism.js"></script>
    <link href="_content/Caviar.AntDesignUI/js/prism.css" rel="stylesheet" />
</body>

</html>
